import { Button } from 'antd';
import { WeaDialog, WeaNewScroll, WeaTab, WeaLocaleProvider } from 'ecCom';
import { inject, observer } from 'mobx-react';
import DialogTask from './DialogTask'
import { Condition } from '../list/listCondition'
import CubeLayout from "../cubeLayout";
import { toJS } from "mobx";
const getLabel = WeaLocaleProvider.getLabel;

@inject("topStore")
@observer
export default class ItemDialog extends React.Component {

    constructor(props) {
        super(props);
        let clientHeight = document.documentElement.clientHeight;
        this.state = {
            title: `${getLabel('384112,21223,388406', '新建督办事项')}`,
            ctrlHeight:  0.95*clientHeight- 107,
            scrollTop: 0,
            topTab: [
                {
                    color: '#000000',
                    groupid: 'flowAll',
                    showcount: true,
                    title: `${getLabel('383349,24902', '任务阶段')}`,
                    viewcondition: 0
                }
            ]
        }
    }


    //解析字段时回调  传入字段的id（field-111）等及相关信息
    getEcmeFieldData = (path, param) => {
        const { cubeLayoutParame } = this.props.topStore;
        const { specialFields } = cubeLayoutParame
        if (path == "field-2116") {
            let aaa = <div {...this.props} {...param} />;
            return aaa;
        }
        return null;
    }

    render() {
        const { topStore } = this.props;
        const { form, formB, visibleTip, clearForm, cubeLayoutParame, getCardStorefun } = topStore;
        const { visible, doClose, id } = this.props;
        const { title, ctrlHeight, topTab } = this.state;
        let buttons = [
            (<Button ecId={`${this && this.props && this.props.ecId || ''}_Button@k721jx@cancel`} type="ghost" onClick={() => { doClose() }}>{getLabel(201, "取消")}</Button>),
            (<Button ecId={`${this && this.props && this.props.ecId || ''}_Button@iraxk0@submit`} type="primary" onClick={this.subBtn.bind(this, id)}>{getLabel(86, '保存')}</Button>)
        ]
        let cubeFlag = Object.keys(toJS(cubeLayoutParame)).length > 0;
        let clientWidth = document.documentElement.clientWidth;
        let clientHeightxk = document.documentElement.clientHeight

        let scroHeight = cubeFlag ? (clientHeightxk - 130) * 0.85 : this.clientHeight * 0.95;
        let scroWidth = cubeFlag ? (clientWidth + 15) * 0.7 : (clientWidth) * 0.7
        return (
            <div className="g-top-itemDialog">
                <WeaDialog ecId={`${this && this.props && this.props.ecId || ''}_WeaDialog@3zm8hv`}
                    onCancel={() => { doClose() }}
                    title={title}
                    visible={visible}
                    style={{ width: scroWidth, height: scroHeight }}
                    hasScroll={!cubeFlag}
                    buttons={buttons}
                    icon="icon-coms-government"
                    iconBgcolor="#f14a2d"
                >
                    <div className="g-itemDialog-form">
                        {cubeFlag
                            ?
                            (visible && CubeLayout({ cubeLayoutParame, "getEcmeFieldData": this.getEcmeFieldData, getCardStorefun })) :
                            (
                                <WeaNewScroll ecId={`${this && this.props && this.props.ecId || ''}_WeaNewScroll@74gl70`} height={ctrlHeight} >
                                    <div>
                                        <div>
                                            <Condition ecId={`${this && this.props && this.props.ecId || ''}_Condition@ka8aha`} listStore={topStore} form={form} listStore2={topStore}></Condition>
                                        </div>
                                        <div style={{ position: "relative" }}>
                                            <WeaTab ecId={`${this && this.props && this.props.ecId || ''}_WeaTab@2k0uyb`}
                                                datas={topTab}
                                                keyParam="viewcondition"
                                                countParam="groupid"
                                            />
                                            <div style={{ position: "absolute", right: "35px", zIndex: "1", top: "44px" }}>
                                                <Button ecId={`${this && this.props && this.props.ecId || ''}_Button@pvpo0c`} type="primary" shape="circle" icon="plus" onClick={this.btnAddClick.bind(this, -1)} />
                                            </div>
                                            <DialogTask ecId={`${this && this.props && this.props.ecId || ''}_DialogTask@fmjbep`} listStoreB={topStore} formB={formB} style={{ marginTop: "10" }} ></DialogTask>
                                        </div>
                                    </div>

                                </WeaNewScroll>
                            )
                        }
                    </div>
                </WeaDialog>
            </div>
        )
    }
    /**
	 * 保存
	 * @param {*} id 哪个督办新建的
	 */
    subBtn(id) {
        const { topStore } = this.props;
        //const {doClose} = this.props;
        topStore.save(id);
        //doClose();
    }
    onScroll(e) {
        this.setState({ scrollTop: e.target.scrollTop })
    }
    btnAddClick(index) {
        const { topStore } = this.props;
        topStore.btnAddClick(index);
    }
}